<template>
    <!-- <div class="panel minh_624">
        <div class="item_title pr">
            项目案例
            <div class="tools-box">
                <router-link :to="{path: '/addcase',query:{'type': 1}}" class="displayB">
                    <i class="el-icon-edit-outline"></i>添加
                </router-link>
            </div>
        </div> -->
        <div>
            <div style="line-height: 30px;" v-show="!listIsZero">
                <div class="padding_16" v-for="(item,index) in listData" :key="index">
                    <div class="pr">
                        <em class="case_em"></em>
                        <span class="case_title">{{item.cp_name}}</span>
                        <div class="operate_box">
                            <router-link :to="{path: '/addcase',query:{'type': 2,'cpid': item.cp_id}}" tag="span" class="operate">编辑</router-link><span class="operate" @click="delcase(item.cp_id)">删除</span>
                        </div>
                    </div>
                    <div class="p_case_item">
                        <span class="p_case_item_l">项目周期：</span>
                        <span>{{item.cp_cycle | re_cp_cycle}}</span>
                        <span style="margin-left: 40px;">担任角色：</span>
                        <span>{{item.cp_role_name}}</span>
                    </div>
                    <div class="p_case_item">
                        <span class="p_case_item_l">应用技术：</span>
                        <span class="p_case_item_r">{{item.cp_technology_name}}</span>
                    </div>
                    <div class="p_case_item">
                        <span class="p_case_item_l">应用地址：</span>
                        <span class="p_case_item_r">{{item.cp_look_address}}</span>
                    </div>
                    <div class="p_case_item">
                        <span class="p_case_item_l">项目介绍：</span>
                        <span class="p_case_item_r">{{item.cp_content}}</span>
                    </div>
                    <div class="p_case_item">
                        <span class="p_case_item_l">项目截图：</span>
                        <span class="p_case_item_r">
                            <img v-for="(pic,ind) in item.cp_photo" :key="ind" :src="pic" width="80" height="80" style="margin-right: 16px;padding: 5px;border: 1px solid rgb(204, 204, 204);" />
                        </span>
                    </div>
                </div>
            </div>
            <!-- 暂无数据 -->
            <div class="mt-large text-center" v-show="listIsZero">
                <img src="../../../assets/images/empty.jpg" height="200" alt="">
                <p class="tip-small">暂无数据</p>
            </div>
        </div>
    <!-- </div> -->
</template>
<script>

    export default {
        data(){
            return{
                listData: {},
                listIsZero: true,
            }
        },
        filters: {
            //周期
            re_cp_cycle: function(value){
                if(value == 1){
                    return '10天以下';
                }else if(value == 2){
                    return '10-30天';
                }else if(value == 3){
                    return '1-3个月';
                }else if(value == 4){
                    return '3-6个月';
                }else if(value == 5){
                    return '6-12个月';
                }else if(value == 6){
                    return '一年及以上';
                }
            },
        },
        methods: {
            init(){

                var _this = this;

                this.$httpGet('/api/index/Personal_center/getUserCase',{
                    'u_id': window.localStorage.uid,
                }).then(response => {
                    
                    if(response.code == 200){

                        _this.listData = response.msg;
                        _this.listIsZero = false;
                        
                    }else if(response.code == 300){
                        _this.listIsZero = true;
                    }else{
                        this.$message({
                            message: response.msg,
                            type: 'warning'
                        });
                    }

                });
            },
            //删除案例
            delcase(cpid){
                var _this = this;

                this.$confirm('确认删除此案例吗?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    _this.$httpGet('/api/index/Personal_center/delCase',{
                        'cp_uid': window.localStorage.uid,
                        'cp_id': cpid
                    }).then(response => {
                        
                        if(response.code == 200){

                            this.$message({
                                message: response.msg,
                                type: 'success'
                            });
                            _this.init();
                            
                        }else{
                            this.$message({
                                message: response.msg,
                                type: 'warning'
                            });
                        }

                    });
                }).catch(() => {
                              
                });

            },
        },
        mounted(){
            this.init();
        },
    }
</script>
